// snabbdom 没有使用export default 因此不能直接导入
// snabbdom 2.0导入方式已经改变
import { h } from 'snabbdom/build/package/h'
// thunk用于优化复杂得视图
// import { thunk } from 'snabbdom/build/package/thunk'
import { init } from 'snabbdom/build/package/init'

// 1. hello world
// patch 是snabbdom得核心函数 
// 参数：数组，模块
// 返回值： patch函数， 作用是对比两个虚拟DOM -> snabbdom 中得VNode 的差异更新到真实DOM
let patch = init([])
// 第一个参数： 标签+选择器
// 第二个参数： 如果是字符串的话就是标签中的内容
let vnode = h('div#container.cls', 'Hello World')

let app = document.querySelector('#app')
// 第一个参数：可以是DOM元素，内部会把DOM元素转换成VNode
// 第二个参数：VNode
// 返回值：VNode
let oldVnode = patch(app, vnode)

// 假设赋值给页面新的div
// 新创一个Vnode
vnode = h('div', 'Hello Snabbdom')
// 比较上次返回的Vnode 并更新到 真实DOM上
patch(oldVnode, vnode)
